<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./style2.css">
    <link rel="stylesheet" href="./font_dw40m5o99d8/iconfont.css">
    <link rel="stylesheet" href="./font_4zi7x58rd9t/iconfont.css">
</head>

<body>
    <header>
        <div class="first-top">
            <a href="http://localhost:3000/index.html"><img src="./imgs/tb.png" alt=""></a>
            <div>
                <input type="text">
                <div>
                    <button>搜淘宝</button>
                    <button>搜本店</button>
                </div>
            </div>
        </div>
        <div class="top">
            <div class="dianji">
                <a href=""></a>
                <a href=""></a>
                <a href=""></a>
                <a href=""></a>
            </div>
            <img src="./imgs/微信图片编辑_20220926205418.jpg" alt="">
        </div>
        <div class="top-list">
            <p><a href="http://localhost:3000/index.html" style="color: #ccc;text-decoration: none;">首页</a></p>
            <p>全部商品</p>
            <p>小米</p>
            <p>iPhone</p>
            <p>oppo</p>
            <p>vivo</p>
            <p>三星</p>
            <p>华为</p>
            <p>荣耀</p>
        </div>
    </header>
    <section>
        <div class="bigesttop">

            <!-- 产品栏-左侧 -->

            <div class="top-left">
                <div class="box">
                    <div class="showBox">
                        <div class="middleBox">
                            <img src="" alt="" class="a1">
                            <!-- <span style="width:200px; height:200px"></span> -->
                            <span></span>
                            <em></em>
                        </div>
                        <div class="list">
                            <div class="listImg">
                                    <!-- <img class="active" src="" alt="">
                                    <img src="" alt="">
                                    <img src="" alt="">
                                    <img src="" alt="">
                                    <img src="" alt=""> -->
                            </div>
                        </div>
                    </div>
                    <div class="bigBox">
                        <img src="" alt="">
                    </div>
                </div>
            </div>

            <!-- 产品栏-中间 -->

            <div class="top-middle">
                <div class="top-title"></div>
                <!-- <h3 class="tit">新品MIUI/小米 Redmi K40S红米k40s手机5G骁龙k40官方旗舰正品</h3> -->
                <div class="price">
                    <div class="price-up">
                        <!-- <span>价格</span>
                        <em>￥5989</em>
                        <div>
                            <strong>5000+</strong>
                            <span>月销量</span>
                        </div> -->
                    </div>
                    <div class="price-down">
                        <span>优惠</span>
                        <p>
                            <img src="./imgs/bi.png" alt="">
                            淘金币可抵<em>1444</em>元
                        </p>
                    </div>
                </div>
                <div class="info-change">
                    <!-- <div class="color-change">
                        <p>机身颜色</p>
                        <ul class="mini-img">
                            <img class="active" src="./imgs/s1.jpg" alt="">
                            <img src="./imgs/s2.jpg" alt="">
                            <img src="./imgs/s0.jpg" alt="">
                            <img src="./imgs/s1.jpg" alt="">
                        </ul>
                    </div> -->
                    <div class="kind-change">
                        <p>套餐类型</p>
                        <div>官方标配</div>
                    </div>
                    <div class="memory-change">
                        <p>存储容量</p>
                        <div class="big-memory">8+128GB</div>
                        <div class="middle-memory">8+256GB</div>
                        <div class="small-memory">12+256GB</div>
                    </div>
                    <div class="edition-change">
                        <p>版本类型</p>
                        <div>中国大陆</div>
                    </div>
                    <div class="many-change">
                        <p>数量</p>
                        <div>
                            <span class="c-devide">-</span>
                            <input type="text" value="1" class="text">
                            <span class="c-add">+</span>
                        </div>
                        <i>件</i>
                    </div>
                    <div class="buy-go">
                        <div class="buy-it">立即购买</div>
                        <div class="shopping-smallcar">加入购物车</div>
                    </div>
                    <div class="promise-buy">
                        <p>服务承诺</p>
                        <span>正品保证</span>
                        <span>极速退款</span>
                        <span>退货运费险</span>
                        <span>七天无理由退换</span>
                    </div>
                </div>
            </div>

            <!-- 产品栏-右侧 -->

            <div class="top-right">
                <div class=" other-info">
                    <div class="title-see">看看其他</div>
                    <div class="something-info">
                        <div class="in-info"></div>
                        <!-- <div class="btns">
                            <div class="iconfont icon-xiangshang"></div>
                            <div class="iconfont icon-xiangxia"></div>
                        </div> -->
                    </div>
                </div>
            </div>
        </div>

        <!-- 广告栏 -->

        <div class="ad-ad">
            <img src="./imgs/TB1U3r4PpXXXXX2apXXXXXXXXXX-990-50.png" alt="">
        </div>

        <!-- 详情栏 -->

        <div class="product-down">
            <div class="p-left">
                <div class="p-shop">
                    <div class="shop-name">天猫官方淘宝店<img
                            src="https://amos.alicdn.com/online.aw?v=2&uid=%E4%BF%A1%E6%81%AF%E6%B8%AF%E6%95%B0%E7%A0%81%E4%B8%93%E8%90%A5%E5%BA%97&site=cntaobao&s=2&charset=utf-8"
                            alt=""></div>
                    <div class="shop-info">
                        <div>
                            <p>描述</p>
                            <em>4.9</em>
                        </div>
                        <div>
                            <p>服务</p>
                            <em>4.7</em>
                        </div>
                        <div>
                            <p>物流</p>
                            <em>4.4</em>
                        </div>
                    </div>
                    <div class="in-save">
                        <p>进店逛逛</p>
                        <p>收藏店铺</p>
                    </div>
                </div>
                <div class="shop-kind">
                    <strong>宝贝分类</strong>
                    <div class="shop-all">
                        <div class="iconfont iconfont icon-arrow_right_fat topone">查看所有宝贝</div>
                        <p class="list-row">
                            <span>按销量</span>
                            <span>按价格</span>
                            <span>按新品</span>
                            <span>按综合</span>
                        </p>
                        <div class="iconfont iconfont icon-arrow_right_fat otherone">价格区间</div>
                        <p class="list-col">
                            <i>999-1999</i>
                            <i>2000-2999</i>
                            <i>3000-3999</i>
                            <i>4000-5999</i>
                            <i>6000-7999</i>
                            <i>8000+</i>
                        </p>
                        <div class="iconfont iconfont icon-arrow_right_fat otherone">手机品牌</div>
                        <p class="list-col">
                            <i>苹果</i>
                            <i>华为</i>
                            <i>荣耀</i>
                            <i>小米</i>
                            <i>oppo</i>
                            <i>vivo</i>
                            <i>其他品牌</i>
                        </p>
                        <div class="iconfont iconfont icon-arrow_right_fat otherone">其他商品</div>
                        <p class="list-col">
                            <i>平板电脑</i>
                            <i>笔记本电脑</i>
                            <i>鼠标</i>
                            <i>键盘</i>
                        </p>
                        <div class="iconfont iconfont icon-arrow_right_fat otherone">十月新品</div>
                        <p class="list-col">
                            <i>ROG游戏手机</i>
                            <i>黑鲨游戏手机</i>
                            <i>华为Meta系列</i>
                            <i>oppoReno系列</i>
                        </p>
                    </div>
                </div>
                <div class="if-like">
                    <strong>您可能喜欢</strong>
                    <div class="products">
                        <div class="left_"></div>
                    </div>
                </div>
            </div>
            <div class="p-right">
                <div class="card">
                    <p>详细信息</p>
                    <p>规格参数</p>
                    <i>
                        手机购买
                        <span class="iconfont icon-erweima"></span>
                        <span class="iconfont icon-xiangxia jt" style="font-size: 12px;"></span>
                        <img src="https://gcodex.alicdn.com/qrcode.do?biz_code=xcode&short_name=a.ZRs8&cmd=createSub&param=id:683012612324;scm:20140619.pc_detail.itemId.0"
                            alt="">
                    </i>
                </div>
                <hr>
                <div class="cont">
                    <div class="main-img">
                        <img src="./imgs/656861549686-【24期免息 当天发货】Apple 苹果 iPhone 14 Pro Max手机5G新品款/详情-01.jpg" alt="">
                        <img src="./imgs/656861549686-【24期免息 当天发货】Apple 苹果 iPhone 14 Pro Max手机5G新品款/详情-02.jpg" alt="">
                        <img src="./imgs/656861549686-【24期免息 当天发货】Apple 苹果 iPhone 14 Pro Max手机5G新品款/详情-03.jpg" alt="">
                        <img src="./imgs/656861549686-【24期免息 当天发货】Apple 苹果 iPhone 14 Pro Max手机5G新品款/详情-04.jpg" alt="">
                        <img src="./imgs/656861549686-【24期免息 当天发货】Apple 苹果 iPhone 14 Pro Max手机5G新品款/详情-05.jpg" alt="">
                        <img src="./imgs/656861549686-【24期免息 当天发货】Apple 苹果 iPhone 14 Pro Max手机5G新品款/详情-06.jpg" alt="">
                        <img src="./imgs/656861549686-【24期免息 当天发货】Apple 苹果 iPhone 14 Pro Max手机5G新品款/详情-07.jpg" alt="">
                        <img src="./imgs/656861549686-【24期免息 当天发货】Apple 苹果 iPhone 14 Pro Max手机5G新品款/详情-08.jpg" alt="">
                        <img src="./imgs/656861549686-【24期免息 当天发货】Apple 苹果 iPhone 14 Pro Max手机5G新品款/详情-09.jpg" alt="">
                        <img src="./imgs/656861549686-【24期免息 当天发货】Apple 苹果 iPhone 14 Pro Max手机5G新品款/详情-10.jpg" alt="">
                        <img src="./imgs/656861549686-【24期免息 当天发货】Apple 苹果 iPhone 14 Pro Max手机5G新品款/详情-11.jpg" alt="">
                        <img src="./imgs/656861549686-【24期免息 当天发货】Apple 苹果 iPhone 14 Pro Max手机5G新品款/详情-12.jpg" alt="">
                        <img src="./imgs/656861549686-【24期免息 当天发货】Apple 苹果 iPhone 14 Pro Max手机5G新品款/详情-13.jpg" alt="">
                        <img src="./imgs/656861549686-【24期免息 当天发货】Apple 苹果 iPhone 14 Pro Max手机5G新品款/详情-14.jpg" alt="">
                        <img src="./imgs/656861549686-【24期免息 当天发货】Apple 苹果 iPhone 14 Pro Max手机5G新品款/详情-15.jpg" alt="">
                        <img src="./imgs/656861549686-【24期免息 当天发货】Apple 苹果 iPhone 14 Pro Max手机5G新品款/详情-16.jpg" alt="">
                    </div>
                    <div class="descripttion">
                        <div class="data-info">
                            <b>存储</b>
                            <p>
                                <span>存储容量</span>
                                <span>4GB+64GB &emsp; 4GB+128GB &emsp; 6GB+128GB</span>
                            </p>
                            <b>机身详情</b>
                            <p>
                                <span>手机类型</span>
                                <span>直板手机</span>
                            </p>
                            <b>网络</b>
                            <p>
                                <span>网络类型</span>
                                <span>4G+全网通</span>
                            </p>
                            <p>
                                <span>网络模式</span>
                                <span>双卡双待</span>
                            </p>
                            <b>显示</b>
                            <p>
                                <span>分辨率</span>
                                <span>1600x720</span>
                            </p>
                            <p>
                                <span>屏幕尺寸</span>
                                <span>6.53英寸</span>
                            </p>
                            <b>拍照功能</b>
                            <p>
                                <span>后置摄像头</span>
                                <span>1300万</span>
                            </p>
                            <p>
                                <span>摄像头类型</span>
                                <span>双摄像头</span>
                            </p>
                        </div>
                        <div class="bag-info">
                            <div>包装清单</div>
                            <p>
                                <span>主机</span>
                                <span>1件</span>
                            </p>
                            <p>
                                <span>充电器</span>
                                <span>1件</span>
                            </p>
                            <p>
                                <span>Type-C数据线</span>
                                <span>1件</span>
                            </p>
                            <p>
                                <span>取卡针</span>
                                <span>1件</span>
                            </p>
                            <p>
                                <span>快速入门指南</span>
                                <span>1件</span>
                            </p>
                            <p>
                                <span>屏幕保护膜（出厂已贴在手机上）</span>
                                <span>1件</span>
                            </p>
                            <p>
                                <span>手机保护套</span>
                                <span>1件</span>
                            </p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <div class="footer">
        <ul>
            <li><a href="#">阿里巴巴集团</a></li>
            <li><a href="#">淘宝网</a></li>
            <li><a href="#">天猫</a></li>
            <li><a href="#">聚划算</a></li>
            <li><a href="#">全球速卖通</a></li>
            <li><a href="#">阿里巴巴国际交易市场</a></li>
            <li><a href="#">1688</a></li>
            <li><a href="#">阿里妈妈</a></li>
            <li><a href="#">飞猪</a></li>
            <li><a href="#">淘小铺</a></li>
            <li><a href="#">阿里云计算</a></li>
            <li><a href="#">AliOS</a></li>
            <li><a href="#">阿里通信</a></li>
            <li><a href="#">一淘</a></li>
            <li><a href="#">万网</a></li>
            <li><a href="#">高德</a></li>
            <li><a href="#">UC</a></li>
            <li><a href="#">友盟</a></li>
            <li><a href="#">阿里安全虾米</a></li>
            <li><a href="#">大麦网</a></li>
            <li><a href="#">钉钉</a></li>
            <li><a href="#">支付宝</a></li>
            <li><a href="#">优酷</a></li>
            <li><a href="#">土豆</a></li>
            <li><a href="#">阿里健康</a></li>
            <li><a href="#">阿里影业</a></li>
            <li><a href="#">阿里体育</a></li>
            <li><a href="#">网商银行</a></li>
        </ul>
    </div>
    <div class="last">
        <ul>
            <li><a href="#">关于淘宝</a></li>
            <li><a href="#">合作伙伴</a></li>
            <li><a href="#">营销中心</a></li>
            <li><a href="#">廉正举报</a></li>
            <li><a href="#">联系客服</a></li>
            <li><a href="#">开放平台</a></li>
            <li><a href="#">诚征英才</a></li>
            <li><a href="#">联系我们</a></li>
            <li><a href="#">网站地图</a></li>
            <li><a href="#">隐私权政策</a></li>
            <li><a href="#">法律声明</a></li>
            <li><a href="#">知识产权</a></li>
            <li><a href="#">版权所有</a></li>
            <span>© 2003-现在 Taobao.com 版权所有</span>
            <li><a href="#">增值电信业务经营许可证：浙B2-20080224</a></li>
            <li><a href="#">增值电信业务经营许可证（跨地区）： B2-20150210</a></li>
            <span>浙网文（2019）1033-086号</span>
            <span>浙江省网络食品销售第三方平台提供者备案：浙网食A33010001</span>
            <span>互联网药品信息服务资格证书（浙）-经营性-2018-0010</span>
            <span>短消息类服务接入代码使用证书：号【2016】00154-A01</span>
            <span>信息网络传播视听许可证：1109364号</span>
            <span>出版物网络交易平台服务经营备案号：新出发浙备字第002号</span>
            <span>浙公网安备 33010002000078号</span>
            <span>广播电视节目制作经营许可证（浙）字第01012号</span>
            <span>市场名称登记证：工商网市字3301004120号</span>
            <span>医疗器械网络交易服务第三方平台备案：（浙）网械平台备字[2018]第00004号</span>
        </ul>
    </div>
    <div class="go-top">
        <div>
            <span class="iconfont icon-xiaoxi"></span>
            <div>消息</div>
        </div>
        <div>
            <a href="http://localhost:3000/cart.html" style="width: 48px;height: 48px;text-decoration: none;color: black;"><span class="iconfont icon-gouwuche"></span></a>
            <div>
            <a href="http://localhost:3000/cart.html" style="width: 48px;height: 48px;text-decoration: none;color: black;"><div>购物车</div></a></div>
        </div>
        <div>
            <span class="iconfont icon-jubao"></span>
            <div>举报</div>
        </div>
        <div>
            <span class="iconfont icon-yijianfankui"></span>
            <div>反馈</div>
        </div>
        <div class="GT">
            <span class="iconfont icon-huidaodingbu"></span>
            <div>回顶部</div>
        </div>
    </div>
</body>


<script src="./move.js"></script>
<script src="./js/ajax.js"></script>
<!-- <script src="./script.js"></script> -->
<script src="./script.js"></script>
<script>
    ajax("http://www.localhost:3000/getgoods", (res) => {
        res = JSON.parse(res)
    })
</script>

</html>